<template>
  <!--产品类型-->
  <Card class="cplx page-fill" style="height:900px">
    <div class="form-box">
      <span class=''>产品名称</span>
      <v-input v-model="productTypeName"></v-input>
      <!-- <span>版本号</span>
      <v-select v-model="version" :select-list="versionData"></v-select> -->
      <v-button size="small" type="primary" @on-click="query">查询</v-button>
      <v-button size="small" type="primary" @on-click="turnPage('dkcpaddbig')" id="addbig">新增</v-button>
    </div>
    <div class="table-data" style="">
      <v-table :columns="columns1" :data="data1"></v-table>
    </div>
    <div class="pagi-box">
      <v-pagination :total="total2" :current-page="currentPage" :page-size="pageSize" @on-page-change="queryPage">
      </v-pagination>
    </div>
  </Card>
</template>

<script>
import api from '@/api'
export default {
  data () {
    return {
      productTypeName: '',
      columns1: [
        {
          type: 'index'
        },
        {
          title: '描述',
          key: 'productTypeName'
        },
        {
          title: '最小贷款金额',
          key: 'minAmount'
        },
        {
          title: '最大贷款金额',
          key: 'maxAmount'
        },
        {
          title: '模式',
          key: 'patternType'
        },
        {
          title: '业务类型',
          key: 'productGroup'
        },
        {
          title: '操作',
          render: function (h, params) {
            const vm = this
            return h('div', {}, [
              h(
                'v-button',
                {
                  props: {
                    type: 'text'
                  },
                  style: {
                    fontSize: '12px'
                  },
                  on: {
                    'on-click' () {
                      vm.$router.push({
                        name: 'dkcpaddbig',
                        params: {
                          type: '2',
                          productType: params.row.productType
                        }
                      })
                    }
                  }
                },
                '查看'
              ),
              h(
                'v-button',
                {
                  props: {
                    type: 'text'
                  },
                  style: {
                    fontSize: '12px',
                    marginLeft: '5px'
                  },
                  on: {
                    'on-click' () {
                      vm.$router.push({
                        name: 'dkcpaddbig',
                        params: {
                          type: '1',
                          productType: params.row.productType
                        }
                      })
                    }
                  }
                },
                ' 编辑'
              )
            ])
          }.bind(this)
        }
      ],
      data1: [],
      total2: 0,
      currentPage: 1,
      pageSize: 10
    }
  },
  created () {
    this.query()
  },
  methods: {
    query () {
      // console.log("111");
      this.currentPage = 1
      var productTypeName = this.productTypeName.trim()
      api
        .searchProduct({
          productTypeName: productTypeName,
          currentPage: this.currentPage,
          pageSize: this.pageSize
        })
        .then(re => {
          this.data1 = re.data.data.list
          this.total2 = re.data.data.total
          this.currentPage = re.data.data.pageNum
          if (re.data.code === 'error') {
            this.$alert({ title: '提示', content: re.data.data })
          }
        })
        .catch(er => { })
    },
    turnPage (path) {
      this.$router.push(path)
    },
    queryPage (n) {
      var productTypeName = this.productTypeName.trim()
      api
        .searchProduct({
          productTypeName: productTypeName,
          pageSize: this.pageSize,
          currentPage: n
        })
        .then(re => {
          this.data1 = re.data.data.list
          this.total2 = re.data.data.total
          this.currentPage = re.data.data.pageNum
          if (re.data.code === 'error') {
            this.$alert({ title: '提示', content: re.data.data })
          }
        })
        .catch(er => { })
    }
  }
}
</script>

<style lang="less">
.cplx {
}
#addbig {
  float: right;
  margin-right: 111px;
}
</style>
